<!--
  - Copyright (c) 2018.
  - 北京九思金信科技有限公司对该文件内容保留所有权利。
  - 未经许可，不得私自拷贝、传播、发布、引用该文件内容，违者将被追究法律责任。
  -->

<template>
    <div v-if="showFlag === 'list'">
        <calculator-list @changeToDetail='changeToDetail' @addCalculator='addCalculator'></calculator-list>
    </div>
    <div v-else>
        <calculator-card :propCalculatorId="calculatorId" @changeToList='changeToList'></calculator-card>
    </div>
</template>

<script>
    import CalculatorList from './CalculatorList.vue'

    export default {
        components: {
            CalculatorList,
        },
        data() {
            return {
                // 列表及详情页面显示标识，默认列表
                showFlag: 'list',

                // 报价主键，作用 1.判断为新增 2.加载详情数据
                calculatorId: ''
            }
        },

        methods: {
            // 列表跳详情页面
            changeToDetail(id) {
                this.showFlag = 'detail'
                this.calculatorId = id
            },

            // 详情页面跳列表页面
            changeToList() {
                this.showFlag = 'list'
                this.calculatorId = ""
            },

            // 新增报价
            addCalculator() {
                this.showFlag = 'detail'
                this.calculatorId = ''
            }
        }
    }
</script>

<style>
</style>
